

(function ($) {
    $.fn.formToWizard = function (options) {
        options = $.extend({
            submitButton: ""
        }, options);

        var element = this;

        var steps = $(element).find("fieldset");
        var count = steps.size();
        var submmitButtonName = "#" + options.submitButton;
        $(submmitButtonName).hide();

        // 2
        $(element).before("<ul id='steps'></ul>");

        steps.each(function (i) {
            $(this).wrap("<div id='step" + i + "'></div>");
            $(this).find("div.fieldset").append("<p id='step" + i + "commands'></p>");

            // 2
            var name = $(this).find("legend").html();
            $("#steps").append("<li id='stepDesc" + i + "'>Step " + (i + 1) + "<span>" + name + "</span></li>");

            if (i == 0) {
                createNextButton(i);
                selectStep(i);
                insertClearing(i);
            }
            else if (i == count - 1) {
                $("#step" + i).hide();
                createPrevButton(i);
                createSubmitButton(i);
                insertClearing(i);
            }
            else {
                $("#step" + i).hide();
                createPrevButton(i);
                createNextButton(i);
                insertClearing(i);
            }
        });



    }
})(jQuery);


function createPrevButton(i) {
    var stepName = "step" + i;
    $("#" + stepName + "commands").append("<button type='button' id='" + stepName + "Prev' style='float:left;' >< Back</button>");

    $("#" + stepName + "Prev").bind("click", function (e) {
        $("#" + stepName).hide();
        $("#step" + (i - 1)).show();
        selectStep(i - 1);
        $(submmitButtonName).hide();
        
    });
}





function createNextButton(i) {
    var stepName = "step" + i;
    $("#" + stepName + "commands").append("<button type='button' id='" + stepName + "Next' style='float:right;'   >Next ></button>");

    $("#" + stepName + "Next").bind("click", function (e) {

        if (validateFormSection(stepName)) {
            $("#" + stepName).hide();
            $("#step" + (i + 1)).show();
            selectStep(i + 1);
            if (typeof count !== 'undefined') {
                if (i + 2 == count) {
                    $(submmitButtonName).show();
                }
            }


        }
    });
}

function createSubmitButton(i) {
    var stepName = "step" + i;
    $("#" + stepName + "commands").append("<button type='button' onclick='processSubmit($(this));' id='" + stepName + "Next' style='float:right;'  >Submit Appeal</button>");
}

function selectStep(i) {
    $("#steps li").removeClass("current");
    $("#stepDesc" + i).addClass("current");
}

function insertClearing(i) {
    var stepName = "step" + i;
    $("#" + stepName + "commands").append("<div style='clear:both;'></div>");
}

var errorMessages = "";
function validateFormSection(stepName) {
    errorMessages = "";
    radioInputName = ""
    fieldNumbers = $("#" + stepName + " input").size() + $("#" + stepName + " select").size();
    noerror = true;
    if (fieldNumbers>0) {
        $("#" + stepName + " input").each(function () {
            if (checkInput($(this))== false) {
                noerror = false;
                $(this).css("border", "1px solid #CC6600");
            } else {
                if ($(this).attr('type') != 'radio')
                    $(this).css("border", "1px solid #AACFE4");
            }
        });

        $("#" + stepName + " select").each(function () {
            if (checkInput($(this)) == false) {
                noerror = false;
                $(this).css("border", "1px solid #CC6600");
            } else {
                    $(this).css("border", "1px solid #AACFE4");
            }
        });


        $("#" + stepName + " input[type='radio']").each(function () {
            if ($(this).attr("name") != radioInputName) {
                radioInputName = $(this).attr("name");
                if (checkInputRadio($(this)) == false) {
                    noerror = false;
                } else {
                    $(this).css("border", "none");
                }
            }
        });

        
    }

    if (errorMessages!="")
        malert("<h3 style='margin:0; padding:0;'>Oops, These fields are required.</h3><br /><ul>" + errorMessages+"</ul>", 280);
    return noerror;


}


function checkInput(obj) {
    if (obj.attr('type') != 'radio') 
    {
        if (obj.hasClass('required')) 
        {
            
            if (obj.val() == null || obj.val() == "" || obj.val() == "none") 
            {
                errorMessages += "<li>"+obj.attr("alt") + " is required.</li>";
                //$("<span class='pvaError'>This field is required.</span>").insertAfter($(obj));
                return false;
            }
        }
    

        if (obj.hasClass('email')) 
        {
            if (obj.val() != "")
            {
                if (isValidEmail(obj.val()) == false) 
                {
                    errorMessages += "<li>" + obj.attr("alt") + " is not a valid Email Address.</li>";
                    //$("<span class='pvaError'>This field is required.</span>").insertAfter($(obj));
                    return false;
                }
            }
        }
    }
    
}

var radioInputName = "";
noerrorn = false;
function checkInputRadio(obj) {
    if (obj.hasClass('required')) {
        name = obj.attr("name");
        if (!$("input[name='" + name + "']").is(":checked")) {
                errorMessages += "<li>Please Answer this question <br ><div style='padding:0 0 0 20px;'>" + obj.attr("alt") + "</div></li>";
                return false;
            } 
    }
}

function isValidEmail(str) {
    var emailPattern = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/;
    return emailPattern.test(str); 
}


$(function () {
    $("input").keyup(function () {
        $(this).css("border", "1px solid #AACFE4");
    });
});